<html>
<head>
    <title>
        Dictionary list ${session.user}
    </title>
    <meta name="layout" content="main"/>
    <g:javascript library="jquery" />
</head>
<body>
<h1>Dictionary list for ${session.user}</h1>

<div class="nav" role="navigation">
    <ul>
        <li><a class="home" href="${createLink(uri: '/')}"><g:message code="default.home.label"/></a></li>
        <li><g:link class="learn" action="learn">Start Learning</g:link></li>
        <li><label for="dirId">Direction:</label> <g:select name="direction" id="dirId" from="${directionList}"
                value="${dirVal}" keys="${keys}"
                onchange="${remoteFunction(action: 'applyDirection', params: '\'dir=\' + this.value')}"/>
    </li>
        <li><g:link class="create" action="create">New Dictionary</g:link></li>
    </ul>
</div>

<table>
    <thead>
    <tr>
        <g:sortableColumn property="work" title="Work"/>
        <g:sortableColumn property="id" title="id"/>
        <g:sortableColumn property="name" title="Dictionary name"/>
        <g:sortableColumn property="creator" title="Dictionary creator"/>

    </tr>
    </thead>
    <tbody>

    <g:each in="${dics}" var="dic">
        <tr>
            <td>
            <div class="postCheckbox">
                <g:checkBox name="work" value="${dic.work}" onchange="${remoteFunction(action: 'applyWork',
//                            update: [success: 'great', failure: 'ohno'],
                            id: dic.id,
                            params: '\'workDic=\' + this.checked')}"/>

            </div>
            </td>
            <td>
            <div class="postText">
                <g:link class="modify" action="modify" id="${dic.id}">${dic.id}</g:link>
            </div>
            </td>
            <td>
            <div class="postText">
                ${dic.name}
            </div>
            </td>
            <td>
            <div class="postDate">
                ${dic.creator}
            </div>
            </td>
        </tr>
    </g:each>
    </tbody>
</table>
</body>
</html>